
<template> 
  
 <!-- <div class="gantt-box" ref="gantt"></div> -->

    <!-- <div ref="container" :style="{width: width+'px', height: height+'px'}">222</div> -->
  <div style="margin-top: 15px; padding: 0 16px">
    <el-tabs type="border-card" style="min-height: 320px; box-shadow: none">
      <el-tab-pane>
   
        <template #label>
        
          <span><i class="el-icon-date"></i>AI回答</span>
        </template>
     
        <p v-html="mes">           
</p> 
      </el-tab-pane>
     
    </el-tabs>
  </div>
</template>
<script>

  // import "@logicflow/core/dist/style/index.css"; // 2.0版本前的引入方式
  //import { ModelObj } from 'vue-3d-model';
//页面引入，如果多个页面使用可以全局引入
import gantt from 'dhtmlx-gantt'; // 引入包
    import 'dhtmlx-gantt/codebase/dhtmlxgantt.css'; // 引入自带的css文件

// import * as THREE from 'three';
// import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
// import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';

// import * as THREE from 'three';
// import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
// import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';


import VolTable from "@/components/basic/VolTable.vue";
//import scene from './scene.gltf';



export default {

 mounted() {
    // this.init();
 

   // this.animate();
    },
  components: {
    VolTable,
     gantt 
    //ModelObj 
 
  },
  // components: {
  //   VolTable,
  //   ModelObj 
  // },
  methods: {
   
   
    init() {
            // 设置时间识别格式
            gantt.config.xml_date = "%Y-%m-%d"
			// //表格列设置
			gantt.config.columns = [
                { name: 'person', label: '项目成员', width: '100', align: 'center' }
			];
 
             gantt.config.scales = [{ unit: 'month', step: 1, date: ' %Y 年  %F' }, { unit: 'day', step: 1, date: '%d' }];
            // 清空旧数据
			gantt.clearAll(); 
            // 销毁gantt实例   按需开启
            // gantt.destructor()
			// 初始化
			gantt.init(this.$refs.gantt);
			// 数据解析
			gantt.parse(this.tasks);
		},
    onModelLoaded() { /* 模型加载完成 */ },
    loadBefore (params, callback) {
      var _row;
      //获取主表选中的行
      this.$emit("parentCall", ($vue) => {
        var rows = $vue.getSelectRows();
        if (rows.length) {
          _row = rows[0];
        }
      });
      if (!_row) {
        //取消选中，清空明细
        return (this.$refs.tableList.rowData.length = 0);
        //  return this.$Message.error("请选中主表行数据");
      }
      params.wheres =[{ name: "Process_Id", value: _row.Process_Id}];
      return callback(true);
    },
    PlcVeiwPlan(action){
      let url = `A_UpperComputer/${action}`;
  
         this.http.post(url, null, true).then((result) => {
      
          if(result.status==false){
            this.$message.error(result.message);
          }else{
            this.mes="";            
            this.mes+="中央刀库异常:"+result.data.isFalut+"<br>"
            if(result.data.isFalut=="True"){
              this.mes+="刀库异常编号:"+result.data.faultNo+"<br>"}
            this.mes+="放刀完成:"+result.data.isKnifeCompleted+"<br>"
            this.mes+="放刀中:"+result.data.isKnifeOngoing+"<br>"
            this.mes+="放刀位置编号:"+result.data.knifeLocationNumber+"<br>"
    
           //this.$message.success('执行成功');
          // this.search();
          }
         });
    //  this.$Message.error("请选中主表行数据");
    }
  },
  data () {
    return {
      scene: null,
      camera: null,
      renderer: null,
      controls: null,
      model: null,
      tableData: [],
      mes: '',
      //从生成的代码sellorder2.vue里面把明细配置复制过来就能用
      tasks: {
				data: [
                 
					{
						id: 1,
						text: 'DFB24019',
						progress: 0.8, //完成度
                        start_date: '2021-10-16', //开始时间 日月年
                        end_date: '2021-10-15',
                        projectStatus: '进行中',
						open: true, //默认打开=
						number: '', //显示字段
                        person: '韩鸿风',
                        post: 'BA',
                        department: '数字化一部',
                        task: '0/20'
					},
                    {
						// toolTipsTxt: '任务#101-001',
						id: 21, //任务id
						text: '任务1的撒的防守打法士大夫', //任务名称
						start_date: '2021-10-16', //开始时间 日月年
                        end_date: '2021-12-26',
						parent: 1, //父级id
						progress: 1, //完成度
						open: true, //默认打开
						status: '已完成',
					},
                    {
						// toolTipsTxt: '任务#101-001',
						id: 22, //任务id
						text: '第二个逾期阶段', //任务名称
						start_date: '2021-12-16', //开始时间 日月年
						end_date: '2022-01-26',
						parent: 1, //父级id
						progress: 1, //完成度
						open: true, //默认打开
						status: '逾期'
					},
                    {
						// toolTipsTxt: '任务#101-001',
						id: 23, //任务id
						text: '第三个进行中阶段', //任务名称
						start_date: '2022-01-20', //开始时间 日月年
                        end_date: '2022-03-03',
						parent: 1, //父级id
						progress: 0.7, //完成度
						open: true, //默认打开
						status: '进行中'
					},
					{
						id: 2,
						text: 'DFB45113',
						progress: 0.7, //完成度
                        start_date: '2021-10-16', //开始时间 日月年
                        projectStatus: '已完成',
                        end_date: '2021-10-15',
						open: true, //默认打开
						number: '哈哈哈' //显示字段
					},
					{
						// toolTipsTxt: '任务#101-001',
						id: 11, //任务id
						text: '项目启动阶段', //任务名称
						start_date: '2022-04-06', //开始时间 日月年
                        end_date: '2022-06-06',
						parent: 2, //父级id
						progress: 1, //完成度
						open: true, //默认打开
						status: '已完成'
					},
					{
						// toolTipsTxt: '任务#101-001',
						id: 12, //任务id
						text: '设计阶段', //任务名称
						start_date: '2022-04-20', //开始时间 日月年
                        end_date: '2022-06-26',
						parent: 2, //父级id
						progress: 0.9, //完成度
						open: true, //默认打开
						status: '进行中'
					},
					{
						// toolTipsTxt: '任务#101-001',
						id: 13, //任务id
						text: '采购阶段', //任务名称
						start_date: '2022-05-14', //开始时间 日月年
                        end_date: '2022-07-26',
						parent: 2, //父级id
						progress: 1, //完成度
						open: true, //默认打开
						status: '未开始'
					}
				],
			
				// 任务之间连接线，目前注释掉了，需要的话打开
				// links: [
				// 	{ id: '10', source: '11', target: '12', type: '1' },
				// 	{ id: '11', source: '11', target: '13', type: '1' },
				// 	{ id: '12', source: '11', target: '14', type: '1' },
				// 	{ id: '13', source: '11', target: '15', type: '1' },
				// 	{ id: '14', source: '23', target: '16', type: '0' },
				// 	{ id: '15', source: '13', target: '17', type: '1' },
				// 	{ id: '16', source: '17', target: '18', type: '0' },
				// 	{ id: '17', source: '18', target: '19', type: '0' },
				// 	{ id: '18', source: '19', target: '20', type: '0' },
				// 	{ id: '19', source: '15', target: '21', type: '2' },
				// 	{ id: '20', source: '15', target: '22', type: '2' },
				// 	{ id: '21', source: '15', target: '23', type: '0' }
				// ]
			},
    }
  }
}
</script>
<style scoped>
 h3{
     font-weight: 500;
    padding-left: 10px;
    background: white;
    margin-top: 8px;
    padding-bottom: 5px;
 }
 #container {
    width: 1000px;
    height: 500px
  }
  .gantt-box {
    width: 2000px;
    height: 400px;
}

.model-viewer {
  width: 100%;
  height: 100vh;
}

.container {
  width: 100%;
  height: 100%;
}
</style>